<!-- 团队详情 -->
<template>
	<view>
		<InfoCard
			:item="{
				headimg: infoObj.teamImg,
				userName: infoObj.teamName,
			}"
		>
			<template #rightContent>
				<view class="pt-10">{{ infoObj.companyName }}</view>
				<view class="pt-2 color9 ov-2">{{ infoObj.teamProfile }}</view>
			</template>
		</InfoCard>

		<view class="borderTop30">
			<view class="linh-50 px-15 fz-16 fw-7" style="border-bottom: solid 1px #f5f5f5"
				>团队服务</view
			>
			<view class="pr-15 py-15">
				<view class="severBox disFlxCC" @click="goTeamExpList">
					<image src="@/static/image/teamServe.png" style="width: 96rpx; height: 96rpx" />
					<view class="fz-16 fw-7 linh-36 mt-5">咨询服务</view>
					<view class="fz-12 color9">线上咨询医生</view>

					<view class="status" v-if="infoObj.onlineStatus === 1">在线</view>
					<view class="status status3" v-else>离线</view>
				</view>
			</view>
		</view>

		<view class="borderTop30">
			<view class="linh-50 px-15 fz-16 fw-7" style="border-bottom: solid 1px #f5f5f5"
				>团队成员({{ expList.length }})</view
			>
			<view v-for="(item, index) in expList" :key="index" class="disFlx py-10 mx-15 borderB">
				<u-image
					:src="item.headimg"
					width="100rpx"
					height="100rpx"
					mode="aspectFill"
					class="shrink0"
				></u-image>
				<view class="pl-10">
					<view class="pt-1 disFlx">
						<text class="color3 fz-16">{{ item.userName || "" }}</text>
						<text v-if="item.postName" class="fz-15 pl-10">{{ item.postName }}</text>
						<view v-if="item.isLeader === 1" class="ml-5">
							<u-tag text="负责人" size="mini" type="primary"></u-tag>
						</view>
					</view>
					<view class="pt-4">
						<text v-if="item.com">{{ item.com }}</text>
						<text v-if="item.deptname" :class="{ 'pl-10': !!item.deptname }">{{
							item.deptname
						}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import InfoCard from "@/components/infoCard";
import orderApi from "@/api/order.js";

export default {
	components: {
		InfoCard,
	},
	data() {
		return {
			getParams: {
				pageNum: 1,
				pageSize: 999,
				teamId: "",
				userType: "0", // 0专家 1用户
			},
			infoObj: {},
			expList: [],
		};
	},
	onLoad(options) {
		this.getParams.teamId = options.teamId;
		this.getList();
		this.getExpList();
	},
	methods: {
		// 获取团队详情
		async getList() {
			const { data } = await orderApi.teamDetail(this.getParams.teamId);
			this.infoObj = data;
		},
		// 获取团队成员
		async getExpList() {
			const { data } = await orderApi.teamExpList(this.getParams);
			this.expList = data;
		},
    // 跳转团队中的专家列表
    goTeamExpList() {
      this.goPage(`/pagesC/team/expList?teamId=${this.getParams.teamId}`)
    }
	},
};
</script>

<style lang="scss" scoped>
.severBox {
	width: 264rpx;
	height: 280rpx;
	background-color: #f5f5f5;
	margin-left: 30rpx;
	border-radius: 16rpx;
	position: relative;
  overflow: hidden;

	.status {
		position: absolute;
		top: 0;
		right: 0;
		color: #ffffff;
		background-color: #20d19a;
		font-size: 24rpx;
		border-radius: 0 0 0 8rpx;
		padding: 4rpx 16rpx;
		white-space: nowrap;
	}
	.status3 {
		background-color: #dddddd !important;
		color: #aaabab !important;
	}
}
</style>
